<template>
    <div class="about">
        <!-- <div class="main" v-if="isLogin">
      123213
        </div>-->
        <!-- 弹框 -->
        <el-dialog
            title="策划中！有啥奇妙想法联系QQ：2152860"
            :visible="!isLogin"
            width="30%"
            center
            :show-close="false"
        >
            <el-input
                type="password"
                v-model="inputVal"
                placeholder="是否回到首页？输入1(是)或者2(不是)！"
                clearable
                @keyup.enter.native="submitForm()"
            />
        </el-dialog>
        <el-dialog title="提交" :visible="isLogin" width="30%" center :show-close="false">
            <el-form label-width="80px">
                <el-row v-loading="loading">
                    <el-col :span="24">
                        <el-form-item label="版本名称">
                            <el-input
                                v-model="param.bbDesc"
                                placeholder="3月大神话★大背包★特色复古★智能假人★暗黑专属★潜龙峡谷★全插件版"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="版本价格">
                            <el-input v-model="param.bbName" placeholder="300"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="版本引擎">
                            <el-input v-model="param.bbEngine" placeholder="GOM、GEE、LEG"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="版本描述">
                            <el-input
                                v-model="param.bbUpdateInfo"
                                placeholder="新制作，ESP、PG大背包均已修复调好"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="版本网站">
                            <el-input
                                v-model="param.showUrl"
                                placeholder="https://docs.qq.com/doc/DUFlVR0tpV0tUTHVD"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="更新时间">
                            <el-input
                                v-model="param.bbUpdate"
                                placeholder="2021-03-14 18:00"
                            ></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item>
                            <el-row style="text-align: right;">
                                <el-button type="primary" @click="onSave()">保存</el-button>
                                <el-button @click="goBack()">取消</el-button>
                                <el-button
                                    type="danger"
                                    @click="deleteRow()"
                                    :disabled="!param.guidCode"
                                >删除</el-button>
                            </el-row>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </el-dialog>
    </div>
</template>

<script>
import { isSb, onSave, onDelete } from "@/api/api";
export default {
    data() {
        return {
            isLogin: false,
            inputVal: "",
            param: {},
            loading: false,
        };
    },
    mounted() {
        this.init();
    },
    methods: {
        init() {
            let param = localStorage.getItem("row");
            if (param) {
                this.param = JSON.parse(param);
            }
        },
        guid() {
            return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(
                /[xy]/g,
                function (c) {
                    var r = (Math.random() * 16) | 0,
                        v = c == "x" ? r : (r & 0x3) | 0x8;
                    return v.toString(16);
                }
            );
        },
        submitForm() {
            isSb({ issb: this.inputVal }).then((res) => {
                if (res.isOk) {
                    this.isLogin = true;
                } else {
                    this.$router.push("/");
                }
            });
        },
        onSave() {
            this.loading = true;
            onSave(this.param).then((res) => {
                if (res.isOk) {
                    localStorage.clear();
                    this.$message({
                        type: "success",
                        message: "保存成功!",
                    });
                    this.loading = false;
                } else {
                    this.loading = false;
                }
            });
        },
        deleteRow() {
            let guidCode = this.param.guidCode;
            this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.loading = true;
                    onDelete({guidCode}).then((res) => {
                        if (res.isOk) {
                            this.$message({
                                type: "success",
                                message: "删除成功!",
                            });
                            this.param = {};
                            localStorage.clear();
                        }
                        this.loading = false;
                    });
                })
                .catch(() => {
                    this.$message({
                        type: "info",
                        message: "已取消删除",
                    });
                });
        },
        goBack() {
            localStorage.clear();
            this.$router.push("/");
        },
    },
};
</script>

<style lang="scss" scoped src="@/styles/css/about.scss">
</style>